<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
<%@taglib prefix="rich" uri="http://richfaces.org/rich" %>
<%@taglib prefix="a4j" uri="http://richfaces.org/a4j" %>

<html>
    <head>

        <script type="text/javascript" language="javascript" src="../scripts/jQuery/confirm.js"></script>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/jquery.fancybox-1.3.4.pack.js"></script>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/jq.date.js"></script>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/easypaginate.js"></script>
        <link rel="stylesheet" type="text/css" href="../css/ui.datepicker.css"/>
        <link rel="stylesheet" type="text/css" href="../css/paging.css"/>
        <link rel="stylesheet" type="text/css" href="../css/dropdown.css"/>
        <link rel="stylesheet" type="text/css" href="../css/richTable.css"/>
        <link rel="stylesheet" type="text/css" href="../css/thickbox.css"/>
        <script type="text/javascript" language="javascript">
            var open_cur = 0;
            $j = jQuery.noConflict();
            $j(document).ready(function(){
                $j('.check_select').live('click',function(){
                    var lang= $j(this).attr("lang");
                    var boool;       
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                            
                    $j.post("customerexpand.jsp?action=addCusp100&p100="+lang+"&valueC="+boool,function(data){
                            
                    });
                });
                
                $j(".checkAll").live("click",function(){
                    
                    flag = $j('.checkAll').is(':checked');
                       
                    $j(".check_select").each(function(){
                        $j('.check_select')  .attr('checked', flag);
                    });
                        
                    var boool;
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                        
                    $j.post("customerexpand.jsp?action=addAllCusp100&boool="+boool,function(data){
                            
                    });

                });
                $j('.keysearch').live('keyup',function(){
                    if($j('.keysearch').val() == ""){
                        $j('.noteRow').show();
                                   
                    }else{
                        $j('.noteRow').hide();
                        $j('.noteRow').each(function(){
                            html = $j(this).html();
                            if(   ununicode(html).indexOf(  ununicode($j('.keysearch').val()) ) > -1    )  {
                                $j(this).show();
                            }else{
                                $j(this).hide();
                            }
                        });
                    }

                }); 
                // customer all
                $j('.check_selectCustomerforUsername').live('click',function(){
                    var lang= $j(this).attr("lang");
                    var boool;       
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                            
                    $j.post("customer4tour.jsp?action=addCusp100&p100="+lang+"&valueC="+boool,function(data){
                            
                    });
                });
                
                $j(".checkAllCustomerforUsername").live("click",function(){
                    
                    flag = $j('.checkAllCustomerforUsername').is(':checked');
                       
                    $j(".check_selectCustomerforUsername").each(function(){
                        $j('.check_selectCustomerforUsername')  .attr('checked', flag);
                    });
                        
                    var boool;
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                        
                    $j.post("customer4tour.jsp?action=addAllCusp100&boool="+boool,function(data){
                            
                    });

                });
                
                
                $j('.check_selectEMP').live('click',function(){
                    var lang= $j(this).attr("lang");
                    var boool;       
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                            
                    $j.post("employee.jsp?action=addCusp100&p100="+lang+"&valueC="+boool,function(data){
                            
                    });
                });
                
                $j(".checkAllEmployee").live("click",function(){
                    
                    flag = $j('.checkAllEmployee').is(':checked');
                       
                    $j(".check_selectEMP").each(function(){
                        $j('.check_selectEMP')  .attr('checked', flag);
                    });
                        
                    var boool;
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                        
                    $j.post("employee.jsp?action=addAllCusp100&boool="+boool,function(data){
                            
                    });

                });
                
                // customer
                $j('.check_selectCustomer').live('click',function(){
                    var lang= $j(this).attr("lang");
                    var boool;       
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                            
                    $j.post("customer.jsp?action=addCusp100&p100="+lang+"&valueC="+boool,function(data){
                            
                    });
                });
                
                $j(".checkAllCus").live("click",function(){
                    
                    flag = $j('.checkAllCus').is(':checked');
                       
                    $j(".check_selectCustomer").each(function(){
                        $j('.check_selectCustomer')  .attr('checked', flag);
                    });
                        
                    var boool;
                    if( $j(this).is(":checked"))
                    {
                        boool = true;
                    }
                    else
                    {
                        boool = false;
                    }
                        
                    $j.post("customer.jsp?action=addAllCusp100&boool="+boool,function(data){
                            
                    });

                });
            });
        </script>
    </head>
    <body>

        <a4j:form>
            <f:loadBundle basename="#{environmentSession.localizationSource}" var="locale"/>
            <h:outputText value="<div class='permission' lang='#{loginSession.right.MENU_DAB_VIEW}'></div>" escape="false"/>
            <div id="content">
                <div id="content_detail">
                    <div class="content_right">
                        <div class="content">
                            <h:inputHidden value="#{smsController.idpage}" id="idpage"/>
                            <h:inputHidden value="#{smsController.actionpage}" id="actionpage"/>
                            <h:inputHidden value="#{smsController.pageString}" id="pageString"/>
                            <div style="width: 100%;float: left; margin-bottom: 5px;" class="checkSMS">
                                <h:outputText value="#{smsController.actionpage}"/>
                                <h:panelGroup rendered="#{smsController.actionpage=='customer4tour'}">
                                     <h:outputLink style="color:#fff;float:left;"   value="viewSMSTemplateTour.jsp?page=#{smsController.actionpage}&action=#{smsController.actionpage}" > 
                                    <img src="../images/icon_sms1.png" alt="SMS" title="Gửi SMS"/>
                                </h:outputLink>
                                </h:panelGroup>
                                <h:panelGroup rendered="#{smsController.actionpage!='customer4tour'}">
                                 <h:outputLink style="color:#fff;float:left;"   value="viewSMSTemplate.jsp?page=#{smsController.actionpage}&action=#{smsController.actionpage}" > 
                                    <img src="../images/icon_sms1.png" alt="SMS" title="Gửi SMS"/>
                                </h:outputLink>
                                </h:panelGroup>
                                <h:outputLink style="color:#fff;float:left; margin-left: 10px;"   value="changePasswordSMSAll.jsp?page=viewSMS&height=453&amp;width=741&amp;modal=true" styleClass="fancybox add_new"  > 
                                    <img src="../images/key.png" alt="SMS" title="Xác nhận mật khẩu"/>
                                </h:outputLink>
                                <h:outputLink style="color:#fff;float:left; margin-left: 10px;"   value="#{smsController.pageString}" styleClass="add_new"  > 
                                    <img src="../images/backSMS.png" alt="SMS" title="quay lại"/>
                                </h:outputLink>
                                <h:inputText style="float:left;" value="" onfocus="if(this.value=='')this.value='';" styleClass="keysearch" />              
                            </div>

                            <div style="float: left;height: 29px;background-color: #4A5763;width: 100%;line-height: 29px;">
                                <div style="margin-left: 15px;color: white;">
                                    <h:outputText value="DANH SÁCH GỬI SMS KHÁCH HÀNG HIỆN CÓ #{smsController.idpage}" style="text-transform:uppercase"/>
                                </div>

                            </div>
                            <table>
                                <tr class="table_thead">
                                    <td class="table_subheadercell" style="width:40px "><h:outputText value="STT" escape="false"/></td>
                                    <td class="table_subheadercell" style="width:42px ">
                                        <h:selectBooleanCheckbox rendered="#{smsController.actionpage=='customerexpand'}" value="#{smsController.selected}" styleClass="checkAll" title="All"/>
                                        <h:selectBooleanCheckbox rendered="#{smsController.actionpage=='customer4tour'}" value="#{smsController.selected}" styleClass="checkAllCustomerforUsername" title="All"/>
                                        <h:selectBooleanCheckbox rendered="#{smsController.actionpage=='employeeUser'}" value="#{smsController.selected}" styleClass="checkAllEmployee" title="All"/>
                                        <h:selectBooleanCheckbox rendered="#{smsController.actionpage=='customerSMSforUserLogin'}"  value="#{smsController.selected}" styleClass="checkAllCus" title="All"/>
                                    </td>
                                    <td class="table_subheadercell" style="width:237px "><h:outputText value="MÃ SỐ KHÁCH HÀNG" /></td>
                                    <td class="table_subheadercell" style="width:419px "><h:outputText value="HỌ TÊN" /></td>
                                    <td class="table_subheadercell" style="width:198px "><h:outputText value="SDT" /></td>
                                    <td class="table_subheadercell" style="width:411px "><h:outputText value="NGƯỜI CHỊU TRÁCH NHIỆM" /></td>

                                </tr>
                            </table>

                            <table>
                                <a4j:repeat value="#{smsController.listSMS}" var="cus" rowKeyVar="row">
                                    <tr class="table_row noteRow">

                                        <td class="table_cell cssCenter "  style="width: 40px;background-color: <h:outputText value="#E0EFFC" rendered="#{row%2==0}"/>">

                                            <h:outputText value="#{row+1}" />
                                        </td>

                                        <td class="table_cell cssCenter " style="width: 42px;background-color: <h:outputText value="#E0EFFC" rendered="#{row%2==0}"/>">                                                      
                                            <div style="width:20px;float: left;">
                                                <h:panelGroup rendered="#{smsController.actionpage=='customerexpand'}">
                                                    <div style="text-align: center;width:100%;">
                                                        <h:selectBooleanCheckbox value="#{smsController.selected}" styleClass="check_select" lang="#{cus.pn100}"/>
                                                    </div>
                                                </h:panelGroup>

                                                <h:panelGroup rendered="#{smsController.actionpage=='customer4tour'}">
                                                    <div style="text-align: center;width:100%;">
                                                        <h:selectBooleanCheckbox value="#{smsController.selected}" styleClass="check_selectCustomerforUsername" lang="#{cus.pn100}"/>
                                                    </div>
                                                </h:panelGroup>

                                                <h:panelGroup rendered="#{smsController.actionpage=='customerSMSforUserLogin'}">
                                                    <div style="text-align: center;width:100%;">
                                                        <h:selectBooleanCheckbox  value="#{smsController.selected}" styleClass="check_selectCustomer" lang="#{cus.pn100}"/>
                                                    </div>
                                                </h:panelGroup>

                                                <h:panelGroup rendered="#{smsController.actionpage=='employeeUser'}">
                                                    <div style="text-align: center;width:100%;">
                                                        <h:selectBooleanCheckbox  value="#{smsController.selected}" styleClass="check_selectEMP" lang="#{cus.pn100}"/>
                                                    </div>
                                                </h:panelGroup>
                                            </div>                                                     
                                        </td>
                                        <td class="table_cell cssCenter " style="width: 240px;background-color: <h:outputText value="#E0EFFC" rendered="#{row%2==0}"/>">

                                            <h:outputText value="#{cus.nv116}" />

                                        </td>
                                        <td class="table_cell cssCenter  " style="width: 424px;background-color: <h:outputText value="#E0EFFC" rendered="#{row%2==0}"/>">

                                            <h:panelGroup rendered="#{smsController.actionpage=='employeeUser'}">
                                                <div style="height: 14px;">     <h:outputLink value="employee.jsp?action=linkEmp&pnPN100=#{cus.pn100}"> <h:outputText value="#{cus.hoten}"/></h:outputLink>
                                                </h:panelGroup>
                                                <h:panelGroup rendered="#{smsController.actionpage !='employeeUser'}">
                                                    <div style="height: 14px;">     <h:outputLink value="customer.jsp?action=linkCus&pnPN100=#{cus.pn100}&type=#{cus.ni104}"> <h:outputText value="#{cus.hoten}"/></h:outputLink>
                                                    </h:panelGroup>

                                                    </td>
                                                    <td class="table_cell cssCenter " style="width: 200px;background-color: <h:outputText value="#E0EFFC" rendered="#{row%2==0}"/>">

                                                        <h:panelGroup rendered="#{smsController.actionpage=='employeeUser'}">
                                                            <div style="height: 14px;">   <h:outputText value="#{cus.nv121}" /></div>
                                                        </h:panelGroup>
                                                        <h:panelGroup rendered="#{smsController.actionpage !='employeeUser'}">
                                                            <div style="height: 14px;">   <h:outputText value="#{cus.nv958}" /></div>
                                                        </h:panelGroup>



                                                    </td>
                                                    <td class="table_cell cssCenter " style="width:417px;background-color: <h:outputText value="#E0EFFC" rendered="#{row%2==0}"/>">

                                                        <div style="height: 14px;"> <h:outputText value="#{cus.nl149}" /></div>

                                                    </td>

                                                    </tr>

                                                </a4j:repeat>
                                                </table>

                                            </div>
                                        </div>
                                        </div>
                                        </div>
                                    </a4j:form>

                                    </body>
                                    </html>


                                    <style type="text/css">
                                        #footer{
                                            width: 100%;
                                        }
                                        #menu_top{
                                            padding-left: 0.7%;
                                            width: 96%;
                                        }

                                        #content_detail {
                                            float: left;
                                            padding-left: 10px;
                                            padding-right: 10px;
                                            padding-top: 0;
                                            width: 98.5%;
                                        }
                                        #main{
                                            width:100%;
                                        }

                                        #content {
                                            background: none repeat scroll 0 0 #FFFFFF;
                                            padding: 0px !important;
                                            width: 100%;
                                        }

                                        #fancybox-wrap{

                                        }
                                        .fields_input{
                                            float: left;
                                            margin-top:4px;
                                            width: 100%;
                                        }
                                        .table_subheadercell1 {

                                            border-right: 1px solid #C4C0C9;
                                            color: #3E4B57;
                                            float: left;
                                            font-family: Arial,Verdana,sans-serif;
                                            font-size: 11px;
                                            padding: 4px;
                                            text-align: center;
                                            white-space: nowrap;
                                        }
                                        table{
                                            width: 100%;
                                        }
                                        .table_thead{
                                            width: 100%;
                                        }
                                        .customer-box label{
                                            width:90px;
                                            text-align: right;
                                            float:left;
                                        }
                                        input{
                                            float:left;
                                            margin-left:9px;
                                        }
                                        select{
                                            float:left;
                                            height: 21px;
                                            width:166px;
                                            margin-left:9px;
                                        }
                                        .ui-datepicker-header select{
                                            width:45% !important;
                                        }
                                        .header-box{
                                            margin-left:25px;
                                            color:#263340;
                                            margin-top:10px;
                                            float: left;
                                            cursor:pointer;
                                            padding:4px 0px 0px 4px; 
                                            width:600px;
                                            border:1px solid #CCCCCC;
                                            font-size:12px;
                                            background: #D4D7D8;
                                            height: 21px;
                                            font-weight: bold;
                                        }
                                        .fixdate .ui-datepicker-trigger  { margin-left: 4px;}

                                        .boder-bomttom{

                                        }

                                        .mail_sms{
                                            float: right;
                                            margin-right: -19px;
                                            margin-top: 5px;
                                        }
                                        .buttonsms {
                                            /*  background: url("../images/button_left.gif") repeat-x scroll 0 0 transparent; */
                                            border: 0 none;
                                            color: white;
                                            cursor: pointer;
                                            float: right;
                                            font-size: 10px;
                                            font-weight: bold;                
                                            margin-right: 7px !important; 
                                            text-transform: uppercase;
                                            margin-top: -13px;
                                            width: auto;
                                        }
                                        .buttonsms span img{
                                            height: 23px !important; 
                                            width: 23px !important; 
                                        }
                                        .mesage{
                                            color: red;
                                            float: left;
                                            margin-left: 252px;
                                            margin-top: 20px;
                                            text-transform: uppercase;

                                        }
                                        .btnsend{
                                            margin-bottom: 5px;
                                            margin-right: 1px;
                                        }
                                        .feild_sex td label{width: 150px !important; color:white; font-size:12px; text-transform: none; margin-left:3px;}

                                        .content-dashboard{
                                            overflow: auto;
                                        }
                                        .cbxEmp {
                                            float: right;
                                            margin-right: 10px;
                                            margin-top: -13px;
                                        }
                                        .lbl_cbxEmp{
                                            float:left;
                                        }
                                        .cbx_editEmp{
                                            float:left;
                                        }
                                        .content_right .content{
                                            margin-top: 10px;
                                        }
                                        #header_content{
                                            width: 87% !important;
                                        }
                                        .showMessageBirthday{
                                            border-radius: 5px 5px 5px 5px;
                                            border: 1px solid gray;
                                            float: left;
                                            margin-left: 47.5%;
                                            margin-top: 0.6%;
                                            position: absolute;
                                            width: 215px;
                                            z-index: 999;
                                            background-color:white;

                                        }
                                        .headershowb{
                                            border-radius: 5px 5px 0px 0px;
                                            width: 100%;
                                            background-color:#303C49;
                                            height: 25px;
                                        }
                                        .closeBirthday{
                                            float: right;
                                            margin-left: 201px;
                                            margin-top: -38px;
                                            position: absolute;
                                            z-index: 9999;
                                            cursor: pointer;
                                        }
                                        .itemdiv{
                                            background-color: white;
                                            width: 100%;
                                            border-bottom: 1px solid gray;
                                            height: 25px;
                                            line-height: 25px;
                                        }

                                        .itemMessage1{
                                            width: 100%;
                                            float: left;
                                            background-color: #9BA3AA;
                                            line-height: 25px;
                                            text-align: center;
                                            cursor: pointer;
                                            font-size: 10px;
                                            font-weight: bold;
                                            color: #FFFFFF;
                                            margin-top: 1px;
                                        }
                                        .itemMessage2{
                                            width: 100%;
                                            float: left;
                                            background-color: #9BA3AA;
                                            line-height: 25px;
                                            text-align: center;
                                            cursor: pointer;
                                            font-size: 10px;
                                            font-weight: bold;
                                            color: #FFFFFF;
                                            margin-top: 1px;
                                        }
                                        .itemMessage3{
                                            width: 100%;
                                            float: left;
                                            background-color: #9BA3AA;
                                            line-height: 25px;
                                            text-align: center;
                                            cursor: pointer;
                                            font-size: 10px;
                                            font-weight: bold;
                                            color: #FFFFFF;
                                            margin-top: 1px;
                                        }
                                        .checkSMS img{
                                            height: 20px;
                                            width: 20px;
                                        }
                                        .itemdivA{
                                            float: left;
                                            width: 100%;
                                        }
                                        .itemdivB{
                                            float: left;
                                            width: 100%;
                                        }
                                        .itemdivC{
                                            float: left;
                                            width: 100%;
                                        }
                                        .itemdivD{
                                            float: left;
                                            width: 100%;
                                        }
                                        .menutop img{
                                            height: 25px !important;
                                            width: 25px !important;
                                        }
                                        .menutop{
                                            margin-top: 0.4%;
                                        }
                                        .menutop1{
                                            float: left !important;
                                            margin-top: 7px !important;
                                            margin-left: 0.5%;
                                        }
                                        .blue{
                                            background-color: #E0EFFC;
                                        }

                                    </style>